<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <script src="../jquery-3.3.1.min.js"></script>
    <style>
        div>div {
            width: 80px;
            height: 80px;
            text-align: center;
            border: 1px solid red;
            float: left;
        }
    </style>
</head>

<body>
    <div class="box">
        <div id="d"></div>
        <!-- 剩余的天数 -->
        <div id="h"></div>
        <!-- 剩余的小时 -->
        <div id="m"></div>
        <!-- 剩余的分钟 -->
        <div id="s"></div>
        <!-- 剩余的秒数 -->
    </div>
    <script>
        var time = new Date('2021-10-1 00:00:00');
        var id = setInterval(start, 1000);

        function start() {
            var now = new Date();
            var cha = parseInt((time - now.getTime()) / 1000);
            if (cha > 0) {
                d = parseInt(cha / 86400);
                h = parseInt((cha / 3600) % 24);
                m = parseInt((cha / 60) % 60);
                s = parseInt(cha % 60);
            } else {
                clearInterval(id);
            }
            $("#d").html(d + "天");
            $("#h").html(h + "时");
            $("#m").html(m + "分");
            $("#s").html(s + "秒");
        }
    </script>
</body>

</html>